<template>
	<view class="posterSetup">
		<view class="font-weight_bold">
			分享海报背景设置
		</view>
		<view class="">
			<text style="color: #999999;">请上传一张分享海报背景，用户推广员海报分享展示</text>
			<view class="">
				<text style="color: #999999;">(建议尺寸676*1200)</text>
			
			</view>
		</view>
		<view class="">
			<sunui-upimg1 class="margin-top_20rpx" :border="'1px dashed #bfbfbf'" :formData="imgFormData"
				:storageMode="storageMode" :header="header" :size="['400rpx', '200rpx']" btnName="上传海报图"
				:uploadServerUrl="upPicUrl" ref="selectimgandupload" @uploaded="imgLoaded" @change="imgsChange"
				:maxFileNumber="1"><template v-slot:icon>
					<uni-icons type="camera-filled" color="#1890FF" size="40"></uni-icons>
				</template></sunui-upimg1>
		</view>
		<view class="confirmRecharge flex" @click="posterSetupFn()">
			确定
		</view>


	</view>

</template>

<script>
	export default {
		components: {

		},
		data() {

			return {
				currency_name: uni.getStorageSync("system").currency_name,
				userInfo: uni.getStorageSync("userInfo"),
				associateGetInfo: uni.getStorageSync("associateGetInfo"),
				imgFormData: {},
				storageMode: "2",
				header: null,

				img: [],
				imgStr: [],
				form: {

					bg_url: ''
				},
				upPicUrl: null,


			}
		},
		onLoad() {
			this.$nextTick(() => {
			
		
			
				this.$refs.selectimgandupload.setItems([this.associateGetInfo.bg_url]);
			})
		},
		onShow() {
			this.$at.releaseKey('submit');
		},
		methods: {
			// 上传图片返回
			imgLoaded(e) {


				this.img = [];
				for (let i = 0; i < e.length; i++) {
					this.img.push(e[i].url);
				}


				this.imgStr = this.img

				this.form.bg_url = this.imgStr.length === 1 ? this.imgStr[0].toString() : this.imgStr
					.join(',');
			},
			imgsChange(file) {




				if (file.length) {
					this.upPicUrl = this.$api.upload;
					let filesNmae = 'nmoBackground_01.png'; // this.timeDate + 'png'
					// this.imgFormData = {
					// 	// file: file,
					// 	getsize: file.size,
					// 	getContentType: ['image/png', 'image/jpeg'],
					// 	getoriginalfilename: filesNmae,
					// 	getName: filesNmae
					// };
					this.$nextTick(() => {
						this.$refs.selectimgandupload.upload(); //图片上传
					});
				} else {
					this.form.bg_url = '',
					this.imgStr = []
				}
				// this.niuyunLoop(file,0)

			},
			posterSetupFn() {

				this.$at.uniDoFunc({
					key: 'submit',
					success: async () => {
						this.$at.lockKey('submit');
						// 登录 需要进行判断当前账号密码 和账号归属店铺及角色是否又选择

						if(!this.form.bg_url){
							this.$sun.toast('请上传海报图', 'none')
							this.$at.releaseKey('submit');
						}else{
							console.log(this.form)
							
							const saveOrUpdate = this.$api.editBgUrl
							const result = await this.$http.post({
								url: saveOrUpdate,
								data: {
							
									...this.form,
									id: this.associateGetInfo.id
								},
								headers: {
									'Authorization': this.userInfo.token
								}
							
							})
							if (result.code == 0) {
							
							
							
								this.$sun.toast(result.message, 'none')
							
							
								setTimeout(() => {
									this.$sun.navBack()
								}, 500)
							
							
							
							} else {
								this.$sun.toast(result.message, 'none')
							}
							
							this.$at.releaseKey('submit');
						}

					}
				});
			}
		}
	}
</script>

<style lang="less">
	.posterSetup {
		padding: 80rpx 20rpx;

		.confirmRecharge {
			position: fixed;
			bottom: 90rpx;
			width: 708rpx;
			height: 104rpx;
			border-radius: 102rpx;
			color: #fff;
			background: rgb(120, 93, 246);
		}

	}
</style>